<%@page import="com.blog.dao.ReplayDao"%>
<%@page import="com.blog.dto.Replay"%>
<%@page import="com.blog.dao.UserDao"%>
<%@page import="com.blog.dto.Tag"%>
<%@page import="com.blog.dao.TagDao"%>
<%@page import="com.blog.dao.ArticleDao"%>
<%@page import="com.blog.dto.Article"%>
<%@page import="java.util.Vector"%>
<%@page import="com.blog.dto.User"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="description" content="">
  <meta name="keywords" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>article </title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-siteapp"/>
  <link rel="icon" type="image/png" href="assets/i/favicon.png">
  <meta name="mobile-web-app-capable" content="yes">
  <link rel="icon" sizes="192x192" href="assets/i/app-icon72x72@2x.png">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
  <link rel="apple-touch-icon-precomposed" href="assets/i/app-icon72x72@2x.png">
  <meta name="msapplication-TileImage" content="assets/i/app-icon72x72@2x.png">
  <meta name="msapplication-TileColor" content="#0e90d2">
  <link rel="stylesheet" href="assets/css/amazeui.min.css">
  <link rel="stylesheet" href="assets/css/app.css">
  <style type="text/css">
  .search-submit{
	margin: 0.15rem 0.15rem;
	line-height: 2.5rem;
	border: 1px solid #eee;
	padding: 0.2rem 0.8rem 0.2rem 0.8rem;
	text-align: center;
	background: #10D07A;
	color: #F3F3F3;
  }
  .search-submit:hover{
	  background: #10D07A;
	  color: #fff;
  }
  
  </style>
</head>

<body id="blog-article-sidebar">
<!-- header start -->
<header class="am-g am-g-fixed blog-fixed blog-text-center blog-header">
    <div class="am-u-sm-8 am-u-sm-centered">
        <!-- <img width="200" src="http://s.amazeui.org/media/i/brand/amazeui.png" alt="Amaze UI Logo"/> -->
        <h1 class="am-hide-sm-only">Weblog</h1>
    </div>
</header>
<hr class="am-hide-sm">
<!-- nav start -->
<nav class="am-g am-g-fixed blog-fixed blog-nav">
<button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-success am-show-sm-only blog-button" data-am-collapse="{target: '#blog-collapse'}" ><span class="am-sr-only">导航切换</span> <span class="am-icon-bars"></span></button>

  <div class="am-collapse am-topbar-collapse" id="blog-collapse">
    <ul class="am-nav am-nav-pills am-topbar-nav">
      <li><a href="<%=request.getContextPath() %>/home/index">首页</a></li>
      
      <li><a href="<%=request.getContextPath() %>/searchServlet?act=category&keyword=科技咨讯">科技咨讯</a></li>
      <li><a href="<%=request.getContextPath() %>/searchServlet">文章分类</a></li>
      <li><a href="<%=request.getContextPath() %>/userManageServlet?act=publish">写文章</a></li>
      <li class="am-dropdown" data-am-dropdown>
     	<%
        	User user = new User();
        	user = (User)session.getAttribute("user");
        %>
        <a class="am-dropdown-toggle" data-am-dropdown-toggle href="javascript:;">
          	<%=user!=null ? user.getUsername() : "登录/注册" %> <span class="am-icon-caret-down"></span>
        </a>
        
        <%
        	if(user!=null){
        %>
        <ul class="am-dropdown-content">
          <li><a href="<%=request.getContextPath() %>/userManageServlet?act=openArticle">文章管理</a></li>         
          <li><a href="<%=request.getContextPath() %>/userManageServlet?act=openTag">标签管理</a></li>
          <li><a href="<%=request.getContextPath() %>/userManageServlet?act=openReplay">评论管理</a></li>
          <li><a href="PersonalInfo.jsp">个人信息</a></li>
          <li><a href="<%=request.getContextPath()+"/userServlet?act=logout" %>">切换账户</a></li>
          <li><a href="<%=request.getContextPath()+"/userServlet?act=logout" %>">退出登录</a></li>
        </ul>
        <%	}else{    %>	
        <ul class="am-dropdown-content">
          <li><a href="login.jsp">登录</a></li>
          <li><a href="register.jsp">注册</a></li>
        </ul>
        <%  } %>
      </li>
    </ul>
   <form class="am-topbar-form am-topbar-right am-form-inline" role="search" action="<%=request.getContextPath() %>/searchServlet"  >
      <div class="am-form-group">
      	<input type="hidden"  name="act" value="searchAll">
        <input type="text" class="am-form-field am-input-sm" name="keyword" placeholder="搜索">
        <input type="submit" class="am-form-field am-input-sm search-submit" value="搜索">
      </div>
    </form>
  </div>
</nav>

<hr>
<!-- nav end -->
<%
	Article article = new Article();
	ArticleDao articleDao = new ArticleDao();
	int article_id = Integer.parseInt(request.getParameter("article_id"));
	article = (articleDao.findArticleById(article_id)).get(0);
	String content = article.getContent();

%>
<!-- content srart -->
<div class="am-g am-g-fixed blog-fixed blog-content">
    <div class="am-u-md-8 am-u-sm-12">
      <article class="am-article blog-article-p">
        <div class="am-article-hd">
          <h1 class="am-article-title blog-text-center"><%=article.getTitle() %></h1>
          <p class="am-article-meta blog-text-center">
              <span><a href="javascript:;" class="blog-color">article &nbsp;</a></span>-
              <span><a href="<%=request.getContextPath() %>/searchServlet?act=author&keyword=<%=article.getAuthor() %>" style="color:#0e90d2;" > @<%=article.getAuthor() %> &nbsp;</a></span>-
              <span><%=article.getPublish_time() %></span>
          </p>
        </div>  
              
        <div class="am-article-bd">
        	<!-- 文章内容 -->
        	<%=content %>
        </div>
      </article>
        
        <div class="am-g blog-article-widget blog-article-margin">
          <div class="am-u-lg-4 am-u-md-5 am-u-sm-7 am-u-sm-centered blog-text-center">
            <span class="am-icon-tags"> &nbsp;</span>
            <%
          	  	String tags = article.getTag();
            	if(tags==null || tags.equals("") ){
            %>
           		<a href="<%=request.getContextPath() %>/searchServlet?act=tag&keyword=''">标签</a> 
            <%
            	}else {
            		String [] tagArr = tags.split(",");
            		for(String tt : tagArr){
            %>
           				<a href="<%=request.getContextPath() %>/searchServlet?act=tag&keyword=<%=tt %>"><%=tt %></a>&nbsp; 
            <%	
            		}
            	}
            %>
            
            <hr>
            <a href=""><span class="am-icon-qq am-icon-fw am-primary blog-icon"></span></a>
            <a href=""><span class="am-icon-wechat am-icon-fw blog-icon"></span></a>
            <a href=""><span class="am-icon-weibo am-icon-fw blog-icon"></span></a>
          </div>
        </div>

        <hr>
        <div class="am-g blog-author blog-article-margin">
          <div class="am-u-sm-3 am-u-md-3 am-u-lg-2">
            <img src="assets/i/f15.jpg" alt="" class="blog-author-img am-circle">
          </div>
          <div class="am-u-sm-9 am-u-md-9 am-u-lg-10">
          <h3><span>作者 &nbsp;: &nbsp;</span><span class="blog-color"><%=article.getAuthor() %></span></h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
          </div>
        </div>
        <hr>
        
        <ul class="am-pagination blog-article-margin">
          <li class="am-pagination-prev"><a href="#" class="">&laquo; 一切的回顾</a></li>
          <li class="am-pagination-next"><a href="">不远的未来 &raquo;</a></li>
        </ul>
        
        <hr>

        <form class="am-form am-g" action="<%=request.getContextPath()+"/replayServlet" %>" method="post">
            <h3 class="blog-comment">评论</h3>
          <fieldset>
          <%
          	if(user==null){
          %>
          	<p>您还没有登录，请登录后进行评论，下方直接输入账号密码进行评论亦可。</p>
            <div class="am-form-group am-u-sm-4 blog-clear-left">
              <input type="text" class="" name="username" placeholder="账号">
            </div>
            <div class="am-form-group am-u-sm-4">
              <input type="password" class="" name="password" placeholder="密码">
            </div>
          <%} else { %>
				<input type="hidden" class="" name="username" placeholder="账号" value="<%=user.getUsername() %>">
          <%} %>
          	<input type="hidden" class="" name="status" placeholder="是否登录" value="<%=user==null ? 0 : 1 %>">
          	<input type="hidden" class="" name="article_id" placeholder="文章id" value="<%=article_id %>">
          	<input type="hidden" class="" name="act" placeholder="动作" value="add">
          	<%
			String path = request.getContextPath();
			String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
			%>
          	<input type="hidden" class="" name="ArticleUrl" placeholder="文章URL" value="<%="/home/article.jsp?article_id="+article_id %>">
            <div class="am-form-group">
              <textarea class="" rows="5" name="content" placeholder="一字千金"></textarea>
            </div>
        
            <p><button type="submit" class="am-btn am-btn-default">发表评论</button></p>
          </fieldset>
        </form>

        <hr>
        
        <!-- 评论列表 -->
   <%
   	Vector<Replay> vReplays = new Vector<Replay>();
   	ReplayDao replayDao = new ReplayDao();
   	vReplays = replayDao.findReplayByArticle_id(article_id);
   	if(!vReplays.isEmpty())
   		for(Replay replay : vReplays){
   %>
        <article class="am-comment">
		  <a href="#link-to-user-home">
		    <img src="http://s.amazeui.org/media/i/demos/bw-2014-06-19.jpg?imageView/1/w/96/h/96" alt="" class="am-comment-avatar" width="48" height="48"/>
		  </a>
		
		  <div class="am-comment-main">
		    <header class="am-comment-hd">
		      <!--<h3 class="am-comment-title">评论标题</h3>-->
		      <div class="am-comment-meta">
		        <a href="<%=request.getContextPath() %>/searchServlet?act=author&keyword=<%=replay.getUsername() %>" class="am-comment-author"><%=replay.getUsername() %></a>
		        评论于 <time datetime="<%=replay.getPublish_time() %>" ><%=replay.getPublish_time() %></time>
		      </div>
		    </header>
		
		    <div class="am-comment-bd">
		      <%=replay.getContent() %>...
		    </div>
		  </div>
		</article>
	<%	} %>
		 <!-- 评论列表末尾 -->
		
    </div>

    <div class="am-u-md-4 am-u-sm-12 blog-sidebar">
        <div class="blog-sidebar-widget blog-bor am-hide-sm">
            <h2 class="blog-text-center blog-title"><span>About ME</span></h2>
            <img src="assets/i/f161.jpg" alt="about me" class="blog-entry-img" >
            <p><%=article.getAuthor() %></p>
            <p>
        我是妹子UI，中国首个开源 HTML5 跨屏前端框架
        </p><p>我不想成为一个庸俗的人。十年百年后，当我们死去，质疑我们的人同样死去，后人看到的是裹足不前、原地打转的你，还是一直奔跑、走到远方的我？</p>
        </div>
        <div class="blog-sidebar-widget blog-bor">
            <h2 class="blog-text-center blog-title"><span>Contact ME</span></h2>
            <p>
                <a href=""><span class="am-icon-qq am-icon-fw am-primary blog-icon"></span></a>
                <a href=""><span class="am-icon-github am-icon-fw blog-icon"></span></a>
                <a href=""><span class="am-icon-weibo am-icon-fw blog-icon"></span></a>
                <a href=""><span class="am-icon-reddit am-icon-fw blog-icon"></span></a>
                <a href=""><span class="am-icon-weixin am-icon-fw blog-icon"></span></a>
            </p>
        </div>
        <div class="blog-clear-margin blog-sidebar-widget blog-bor am-g ">
            <h2 class="blog-title"><span>TAG cloud</span></h2>
            <div class="am-u-sm-12 blog-clear-padding">
            <%
            Vector<Tag> vTags = new Vector<Tag>();
            UserDao userDao = new UserDao();
            int user_id = userDao.findUserIdByName(article.getAuthor());
    		TagDao tagDao = new TagDao();
    		vTags = tagDao.findTagByUser_id(user_id);
    		for(Tag tag : vTags){
            %>
	            <a href="<%=request.getContextPath() %>/searchServlet?act=tag&keyword=<%=tag.getTag_name() %>" class="blog-tag"><%=tag.getTag_name() %></a>
	        <%} %>
	            
            </div>
        </div>
        
      
    </div>
</div>
<!-- content end -->
  <div data-am-widget="gotop" class="am-gotop am-gotop-fixed" style="right: 10%; bottom:50px; ">
    <a href="#top" title="回到顶部">
        <span class="am-gotop-title">回到顶部</span>
          <i class="am-gotop-icon am-icon-chevron-up" style="background-color: #0e90d2;"></i>
    </a>
  </div>

 <footer class="blog-footer">
    <div class="am-g am-g-fixed blog-fixed am-u-sm-centered blog-footer-padding">
        <div class="am-u-sm-12 am-u-md-4- am-u-lg-6 am-text-center">
            <h2>网站简介</h2>
            <p class="am-text-sm am-text-left text-indent2" style="text-indent:2em; ">
            	该博客管理系统开发的总体目标为实现的方便、高效、快捷的搭建个人博客，方便大家对个人博客的使用和方便管理员对个人博客的管理，从而促进大家网络的交流。
            	
            </p>
            <p class="am-text-sm am-text-left text-indent2" style="text-indent:2em; ">
            	本网站是用来amaze UI开发前端页面，系统中还使用了UEditor富文本编辑器，实现了类似word文档的样式编辑功能和图片插入。
            </p>
            
            
            <!-- &nbsp;&nbsp;&nbsp;&nbsp; -->
        </div>
        
        <div class="am-u-sm-12 am-u-md-4- am-u-lg-6 am-text-center">
             <h2 class="am-center">我们站在巨人的肩膀上</h2>
            
            <p>
                <ul class="am-text-left">
                    <li class="am-u-sm-4"><a href="https://www.runoob.com/jquery/jquery-tutorial.html" target="_blank">jQuery</a></li>
                    <li class="am-u-sm-4"><a href="https://www.html.cn/doc/zeptojs_api/" target="_blank">Zepto.js</a></li>
                    <li class="am-u-sm-4"><a href="http://amazeui.org/css/utility" target="_blank">amaze UI</a></li>
                    <li class="am-u-sm-4"><a href="https://ueditor.baidu.com/website/" target="_blank">UEditor</a></li>
                    <li class="am-u-sm-4"><a href="https://www.layui.com/" target="_blank">layui</a></li>
                    <li class="am-u-sm-4"><a href="http://www.h-ui.net/H-ui.admin.shtml" target="_blank">h-ui</a></li>
                    <li class="am-u-sm-4"><a href="https://www.runoob.com/mysql/mysql-tutorial.html" target="_blank">MySQL</a></li>
                    <li class="am-u-sm-4"><a href="https://easy-mock.com/login" target="_blank">easy mock</a></li>
                    <li class="am-u-sm-4"><a href="" target="_blank">...</a></li>
                </ul>
            </p>
        </div>
    </div>    
    <div class="blog-text-center">© 2015 Weblog , Inc. Licensed under MIT license. Made with love By LWXYFER</div>    
  </footer>

<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/amazeui.min.js"></script>
<!-- <script src="assets/js/app.js"></script> -->
</body>
</html>